<div id="content" style="position: relative; min-height: 100%">
  <div id="fix_overflow">
    <div class="row s_page_title">
      <sa-big-breadcrumbs
        [items]="['运输任务', '订单管理[算法]']"
        icon="fa fa-truck"
        class="col-xs-12 col-sm-7 col-md-7 col-lg-4"
      ></sa-big-breadcrumbs>
    </div>
    <sa-widgets-grid>
      <div class="s_table">
        <div sa-widget [editbutton]="false" color="darken" class="clearfix">
          <header>
            <span class="widget-icon"><i class="fa fa-table"></i></span>
            <h2>订单管理[算法]</h2>
          </header>
          <div>
            <div class="widget-body no-padding">
              <div class="page-header clearfix s_table_opreation" style="padding-bottom: 0; position: relative">
                <div class="left page-header-btn">
                  <sa-company-tree-car
                    companyTreeId="companyTree"
                    [isShowCarSort]="true"
                    [isLinkCompanyAndCar]="false"
                    (companySelected)="companySelected($event)"
                  ></sa-company-tree-car>
                  <div class="top_module top_module_box" style="min-width: auto">
                    <span class="top_module_label module_text">装载耗时</span>
                    <select
                      name=""
                      class="top_module_select"
                      style="min-width: 110px"
                      [(ngModel)]="queryForm.loadingTimeType"
                    >
                      <option value="">全部</option>
                      <option value="1">≤10</option>
                      <option value="2">≤20</option>
                      <option value="3">≤30</option>
                      <option value="4">≤40</option>
                      <option value="5">≤50</option>
                      <option value="6">≤60</option>
                      <option value="7">>60</option>
                    </select>
                  </div>
                  <div class="top_module top_module_box" style="min-width: auto">
                    <span class="top_module_label module_text">卸载耗时</span>
                    <select
                      name=""
                      class="top_module_select"
                      style="min-width: 110px"
                      [(ngModel)]="queryForm.unLoadingTimeType"
                    >
                      <option value="">全部</option>
                      <option value="1">≤10</option>
                      <option value="2">≤20</option>
                      <option value="3">≤30</option>
                      <option value="4">≤40</option>
                      <option value="5">≤50</option>
                      <option value="6">≤60</option>
                      <option value="7">>60</option>
                    </select>
                  </div>
                  <div class="top_module top_module_box" style="min-width: auto">
                    <span class="top_module_label module_text">时间类型</span>
                    <select name="" class="top_module_select" style="min-width: 110px" [(ngModel)]="queryForm.dateType">
                      <option value="1">上货时间</option>
                      <option value="2">卸货时间</option>
                      <!-- <option value="3">创建时间</option> -->
                    </select>
                  </div>
                  <div class="selectDate top_module">
                    <div class="input-daterange input-group s_selected_time_box s_hover_box">
                      <input
                        type="text"
                        [(ngModel)]="queryForm.startTime"
                        class="form-control s_selected_time"
                        id="datetimepicker1"
                        autocomplete="off"
                        placeholder="选择开始时间"
                      />
                      <span class="s_selected_time_spe">至</span>
                      <input
                        type="text"
                        [(ngModel)]="queryForm.endTime"
                        class="form-control s_selected_time"
                        id="datetimepicker2"
                        autocomplete="off"
                        placeholder="选择结束时间"
                      />
                      <div class="s_del_icon" (click)="del_date()">x</div>
                    </div>
                  </div>
                  <div class="top_module">
                    <span class="module_text">选择天数</span>
                    <select name="" id="" class="module_inp" [(ngModel)]="dateNumber" (change)="selectDate()">
                      <option value="">请选择</option>
                      <option value="10">近10天[默认]</option>
                      <option value="20">近20天</option>
                      <option value="30">近30天</option>
                      <option value="60">近60天</option>
                      <option value="90">近90天</option>
                      <option value="100">近100天</option>
                    </select>
                  </div>
                  <div class="top_module" style="min-width: auto">
                    <span class="top_module_label module_text">排序方式</span>
                    <select name="" class="top_module_select" style="min-width: 110px" [(ngModel)]="queryForm.sortType">
                      <option value="">无</option>
                      <option value="1">升序</option>
                      <option value="2">降序</option>
                    </select>
                  </div>
                  <div class="top_module sort-top_module" style="min-width: auto; height: auto !important">
                    <span class="top_module_label module_text">排序</span>
                    <select name="" class="top_module_select" style="min-width: 110px" id="sortSelect" multiple>
                      <option value=""></option>
                    </select>
                  </div>

                  <div class="layui-form-item" style="display: inline-block; margin-bottom: 0">
                    <div class="layui-inline" style="margin-right: 0">
                      <label
                        class="layui-form-label"
                        style="font-size: 12px; padding: 0; width: 50px; line-height: 28px"
                      >
                        装载地
                      </label>
                      <div style="display: flex" class="select_group--container">
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.loadingAddressPIndex"
                          (change)="provinceChange($event.target.value)"
                          name="province"
                          placeholder="请选择省"
                          autocomplete="address-level1"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of provinceNameArr; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.loadingAddressCIndex"
                          name="city"
                          placeholder="请选择市"
                          (change)="cityChange($event.target.value)"
                          autocomplete="address-level2"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of cityNameArr; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.loadingAddressIndex"
                          name="townId"
                          placeholder="请选择区"
                          autocomplete="address-level3"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of townNameArr; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                      </div>
                    </div>
                  </div>
                  <img
                    [src]="transformIcon"
                    style="width: 15px; margin: 0 5px; cursor: pointer"
                    (click)="switchPosition()"
                  />
                  <div class="layui-form-item" style="display: inline-block; margin-bottom: 0; margin-right: 10px">
                    <div class="layui-inline" style="margin-right: 0">
                      <label
                        class="layui-form-label"
                        style="font-size: 12px; padding: 0; width: 50px; line-height: 28px"
                      >
                        卸货地
                      </label>
                      <div style="display: flex" class="select_group--container">
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.unloadAddressPIndex"
                          (change)="provinceChange1($event.target.value)"
                          name="province"
                          placeholder="请选择省"
                          autocomplete="address-level1"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of provinceNameArr1; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.unloadAddressCIndex"
                          (change)="cityChange1($event.target.value)"
                          name="city"
                          placeholder="请选择市"
                          autocomplete="address-level2"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of cityNameArr1; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                        <select
                          class="form-control"
                          [(ngModel)]="areaSelected.unloadAddressIndex"
                          name="townId"
                          placeholder="请选择区"
                          autocomplete="address-level3"
                        >
                          <option value="">请选择</option>
                          <option *ngFor="let item of townNameArr1; let i = index" [value]="i">
                            {{ item.areaName }}
                          </option>
                        </select>
                      </div>
                    </div>
                  </div>

                  <button type="button" class="btn btn-primary" (click)="table_search()">查询</button>
                  <button type="button" class="btn btn-primary" (click)="exportTable()">导出</button>
                </div>
              </div>
              <div class="table_scroll">
                <table
                  class="display dataTables responsive table table-striped table-bordered table-hover dataTable s_h5_table"
                >
                  <thead>
                    <tr>
                      <!--                    <th>订单编号</th>-->
                      <th>车牌号码</th>
                      <th>公司名称</th>
                      <th>重量(吨)</th>
                      <th>上货开始时间</th>
                      <th>上货结束时间</th>
                      <th>卸货开始时间</th>
                      <th>卸货结束时间</th>
                      <th>创建时间</th>
                      <th>卸货点经度</th>
                      <th>卸货点纬度</th>
                      <th>卸货地</th>
                      <th>发货点经度</th>
                      <th>发货点纬度</th>
                      <th>发货地</th>
                      <th>是否厂区内上货</th>
                      <th>上货厂区</th>
                      <th>装载耗时</th>
                      <th>卸载耗时</th>
                      <th>运输时长</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr
                      *ngFor="let row of tableData; let i = index"
                      [attr.data-index]="i"
                      [ngClass]="{ selected: activeSelected === row.id }"
                      (dblclick)="rowSelectEvent(row, i)"
                    >
                      <!--                    <td>{{row.orderCode}}</td>-->
                      <td>{{ row.carNumber }}</td>
                      <td>{{ row.companyName }}</td>
                      <td>{{ row.weight }}</td>
                      <td>{{ row.loadStartTime }}</td>
                      <td>{{ row.loadEndTime }}</td>
                      <td>{{ row.unloadStartTime }}</td>
                      <td>{{ row.unloadEndTime }}</td>
                      <td>{{ row.createTime }}</td>
                      <td>{{ row.receivingLng }}</td>
                      <td>{{ row.receivingLat }}</td>
                      <td>{{ row.receivingAddress }}</td>
                      <td>{{ row.consignorLng }}</td>
                      <td>{{ row.consignorLat }}</td>
                      <td>{{ row.consignorAddress }}</td>
                      <td>
                        {{
                          row.isRail === 0
                            ? '未判断/无围栏'
                            : row.isRail === 1
                            ? '在围栏内'
                            : row.isRail === 2
                            ? '不在围栏内'
                            : '--'
                        }}
                      </td>
                      <td>{{ row.loadCompanyName }}</td>
                      <td>{{ row.loadingTime }}</td>
                      <td>{{ row.unloadingTime }}</td>
                      <td>{{ row.transportationTime }}</td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <div class="table-fix clearfix">
                <paginator
                  [totalRecords]="totalCount"
                  [rows]="pageSize"
                  [currentPage]="curPage - 1"
                  (onPageChange)="paginate($event)"
                ></paginator>
                <button type="button" class="btn default refresh_btn" (click)="refresh()">
                  <i class="fa fa-refresh"></i>
                </button>
              </div>
            </div>
          </div>
        </div>
      </div>
    </sa-widgets-grid>
  </div>
</div>
